// pages/colorpad/colorpad.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    color: "#000000",
    bgcolor: "#ffffff",
    red: '0',
    green: '0',
    blue: '0',
    hexLabel: "使用十六进制颜色值"
  },
  isHex: true,
  toHex:function(num){
    var str = ""
    if(num<16){
      str = "0"+num.toString(16)
    }else{
      str = num.toString(16)
    }
    return str
  },
  setColor:function(){
    var rr = this.data.red
    var gg = this.data.green
    var bb = this.data.blue
    var dark =(Number(rr)+Number(gg)+Number(bb))<383
    var str=""
    if(this.isHex){
      str = "#" + this.toHex(Number(rr))+this.toHex(Number(gg))+this.toHex(Number(bb))
      this.setData({color:str})
    }else{
      str="rgb("+rr+","+gg+","+bb+")"
      this.setData({color:str})
    }
    if(dark){
      this.setData({bgcolor:"#ffffff"})
    }else{
      this.setData({bgcolor:"#000000"})
    }
  },
sliderChange:function(e){
  var rgb = e.target.dataset.val
  if (rgb ==='r'){
    this.setData({red: e.datail.value})
    this.setColor()
  }else if (rgb ==='g'){
    this.setData({green: e.datail.value})
    this.setColor()
  }else if (rgb ==='b'){
    this.setData({blue: e.datail.value})
    this.setColor()
  }
},
numBtn:function(e){
  var step =e.target.dataset.val
  if(step ==='r-1'){
    if(this.data.red<=1){
      this.setData({red:0})
    }else{
      this.setData({red:this.data.red - 1})
    } 
  }else if(step ==='r+1'){
      if(this.data.red<=254){
        this.setData({red:255})
      }else{
        this.setData({red:this.data.red + 1})
      }
  }else if(step ==='g-1'){
    if(this.data.green<=1){
      this.setData({green:0})
    }else{
      this.setData({green:this.data.green - 1})
    } 
  }else if(step ==='g+1'){
      if(this.data.green<=254){
        this.setData({green:255})
      }else{
        this.setData({green:this.data.green + 1})
      }
  }else if(step ==='b-1'){
    if(this.data.blue<=1){
      this.setData({blue:0})
    }else{
      this.setData({blue:this.data.blue - 1})
    } 
  }else if(step ==='b+1'){
      if(this.data.blue<=254){
        this.setData({blue:255})
      }else{
        this.setData({blue:this.data.blue + 1})
      }
  }
  this.setColor()
},
switchChange:function(e){
  if(e.datail.value){
    this.isHex = true
    this.setColor()
    this.setData({hexLabel:"使用十六进制格式的颜色值"})
  }else{
    this.isHex = false
    this.setColor()
    this.setData({hexLabel:"使用十进制格式的颜色值"})
  }
}
  })